require(['./config'], () => {
   require(['template','header', 'footer'], (template,Header) => {
      class List {
         constructor() {
            this.page = 1
            this.sort = 'sort'
            this.menu()
            this.init()
            this.getList().then(()=>{
               this.getTagType()
               this.nextPrev()
            })
         }
         init() {
            // console.log(localStorage.getItem('id'))
            localStorage.removeItem('id')
            //头部复用
            // new Header('/html/modules/header.html')
         }
          //分页
          nextPrev(){
             //下一页
            
            $('#next').on('click',() => {
               ++this.page
               // console.log(this.pageCount)
               if(this.page == this.pageCount){
                  alert('已经是最后一页咯')
                  $('#next').addClass('noClick')
                  
               }else{
                  this.getList()
                  $('#prev').removeClass('noClick')
               }
               // this.getList()
            })
            //上一页
            $('#prev').on('click',() => {
               --this.page
               if(this.page <0){
                  alert('已经是最前面一页咯')
               $('#prev').addClass('noClick')
               }else{
                  this.getList()
                  $('#next').removeClass('noClick')
               }
            })
            if(this.page == 1){
               $('#prev').addClass('noClick')
               // $('#prev').off('click')
            }
       
         }
         //综合排序
         menu(){
            const _this = this
            $('#sort').addClass('click-a')
            //销量排序
            $('#sales').on('click',function(){
               _this.sort = 'sales'
               // console.log(this.sort)
               _this.getList()
               $(this).addClass('click-a').siblings().removeClass('click-a')
            })
            //价格低到高
            $('#price_low').on('click',function(){
               _this.sort = 'price_low'
               // console.log(this.sort)
               _this.getList()
               $(this).addClass('click-a').siblings().removeClass('click-a')
            })
            //价格高到低
            $('#price_high').on('click',function(){
               _this.sort = 'price_high'
               // console.log(this.sort)
               _this.getList()
               $(this).addClass('click-a').siblings().removeClass('click-a')
            })
            //综合排序
            $('#sort').on('click',function(){
               _this.sort = 'sort'
               // console.log(this.sort)
               _this.getList()
               $(this).addClass('click-a').siblings().removeClass('click-a')
            })
         }
         //获取数据
         getList() {
            return new Promise(resolve => {
                  // 从地址栏取到id，根据id发送请求获取数据
               // console.log(location)
               const id = location.search.slice(4)
               // console.log(location)
               if(id){
                  $.get(`/v1/search/goods-list?category_id=${id}`, {
                     page: this.page,
                     sort: this.sort,
                     num : 20,
                     type : 'shop',
                     channel_id : 1001
                  }, resp => {
                     // console.log(resp)
                     if (resp.msg === 'success'){
                        //成功执行的代码
                        const{list} = resp.data
                        // console.log(list)
                        $('#goods').html(template('goodsTemplate',{list}))
                        // console.log($('span'))
                         resolve()
                     }
                     const {pageCount} = resp.data
                     this.pageCount = pageCount
                  })
               }else{
                  location.href = '/index.html'
               }               
            })    
         }
        
         //获取满减 直降等
         getTagType(){
           $('span').each(function(index,item){
              if($(this).data('tagtext') === 0){
                 $(this).css('border','none')
                 
              }
              else if($(this).data('tagtext') === 5){
                 $(this).css({
                     color: '#a06e37',
                     background:' #fffbdf',
                     borderColor: '#d5b480'
                 })
               }
               else{
                  $(this).css({
                     color: '#d03b34',
                     background: '#ffe7e5',
                     borderColor: '#f3938b'
                    })
               }
           })
         }
      }
      new List()
   })
})